.read-main{
    overflow: auto;
    .cover{
        background-color: #000000;
        opacity: 0.5;
        pointer-events: none;
    }
    .read-wrapper{
        padding:0 10px;
        padding-bottom: 1rem;
        background-color: #b4d7cd;
        .title{
            padding: 0.75rem 0 0.75rem 0;
            color: #040000;
            font-size: 0.6rem;
            text-align: center;
        }
        .btn-wrapper{
            display: flex;
            justify-content: space-between;
            button{
                width: 2.19rem;
                height: 0.94rem;
                color: #ffffff;
                font-size: 0.36rem;
                border-radius: 0.05rem;
            }
            .last-chapter,.next-chapter{
                background-color: #56b89b;
                border: 1px solid #56b89b;
            }
            .back-home{
                background-color: #478fea;
                border: 1px solid #478fea;
            }
            .back-catalog{
                background-color: #f19d53;
                border: 1px solid #f19d53;
            }
        }
        .tool-wrapper{
            position: relative;
            padding: .5rem 0;
            .source{
                color: #404040;
                font-size: 0.36rem;
                em{
                    display: inline-block;
                    height: 0.44rem;
                    color: #404040;
                    border-bottom: 1px solid  #404040;
                }
            }
            .right{
                flex: 1;
                text-align: right;
                span{
                    position: relative;
                    margin-left: .3rem;
                    display: inline-block;
                    width: 1.05rem;
                    height: 1.06rem;
                    line-height: 1.06rem;
                    color: #ffffff;
                    font-size: 0.36rem;
                    text-align: center;
                    border-radius: 50%;
                    background-color: #404040;
                    border: 1px solid #404040;
                }
                .change-skin{
                    margin-left: .3rem;
                    display: inline-block;
                    width: 1.05rem;
                    height: 1.06rem;
                    border-radius: 50%;
                    vertical-align: middle;
                }
                .night-skin{
                    @include background('~assets/image/read/night.png');
                }
                .day-skin{
                    @include background('~assets/image/read/day.png');
                }
            }
            .triangle-icon{
                position: absolute;
                bottom: .16rem;
                left: 5.2rem;
                display:block;
                width:0;
                height:0;
                border-width:0 .26rem .28rem;
                border-style:solid;
                border-color:transparent transparent rgba(64, 64, 64, .5);/*透明 透明  黄*/
            }
            .skin-wrapper{
                position: absolute;
                bottom: -1.2rem;
                width: 10.29rem;
                height: 1.36rem;
                background-color: rgba(64, 64, 64, .5);
                border-radius: 0.2rem;
                z-index: 99999;
                span{
                    margin: 0 .28rem;
                    display: inline-block;
                    width: 1.05rem;
                    height: 1.06rem;
                    border-radius: 50%;
                }
            }
        }
        .content{
            margin-bottom: 1rem;
            padding-top: .1rem;
            min-height: 5rem;
            color: #040000;
            font-size: 16px;
            text-indent: 2em;
            p{
                text-indent: 2em;
            }
        }
    }
    .skin-1{
        background-color: #b9dcbf;
    }
    .skin-2{
        background-color: #e2d3ff;
    }
    .skin-3{
        background-color: #caebf7;
    }
    .skin-4{
        background-color: #dbccd2;
    }
    .skin-5{
        background-color: #b4d7cd;
    }
    .skin-6{
        background-color: #c2ceeb;
    }
    .night-read-wrapper{
        background-color: #000000;
        .title{
            color: #ffffff;
        }
        .content{
            color: #ffffff;
        }
        .tool-wrapper{
            .source{
                color: #ffffff;
                em{
                    color: #ffffff;
                    border-bottom: 1px solid  #ffffff;
                }
            }
        }
        
    }
    .hot-wrapper{
        padding:0.46rem 10px;
        .header{
            position: relative;
            .line{
                position: relative;
                bottom: 1.5px;
                display: inline-block;
                width: 0.09rem;
                height: 0.39rem;
                margin-right: .25rem;
                border-radius: 1px;
                vertical-align: middle;
                background-color: #f40000;
            }
            .plate-title{
                color: #4b4b4b;
                font-size: 0.365rem;
            }
        }
        .like-content{
            .list{
                margin-top: 0.39rem;
                ul{
                    li{
                        display: flex;
                        padding-bottom: 0.39rem;
                        // padding-top: 0;
                        .left{
                            flex: 0 0 1.67rem;
                            margin-right: 0.39rem;
                            img{
                                width: 100%;
                                height: 2.31rem;
                            }
                        }
                        .right{
                            padding-bottom: 0.3rem;
                            border-bottom: 1px solid #efefef; 
                            p{
                                width: 8rem;
                                font-size: 0.38rem;
                                color: #838a96; 
                            }
                            .title{
                                position: relative;
                                color: #3b3f47;
                                font-size: 0.4rem;
                            }
                        }
                        &:last-child{
                            padding-bottom: 0;
                            .right{
                                border: 0;
                            }
                        }
                    }
                }
            }
            
        }
    }
    .footer{
        width: 100%;
        height: 1.4rem;
        color: #b9bcc1;
        font-size: 0.36rem;
        line-height: 1.4rem;
        text-align: center;
	    background-color: #f7f7f7;
    }
    .showGuanggao{
        margin-bottom: 1.65rem;
    }
    .present-money-wrapper{
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        width: 9.17rem;
        height: 13.28rem;
        background-color: #ffffff;
        border-radius: 0.2rem; 
        overflow: hidden;
        z-index: 9999999999999;
        @include background('~assets/image/money/bg.png');
        .header{
            position: relative;
            top: 1rem;
            width: 100%;
            height: 0.98rem;
            z-index: 99999999999999;
            .cancel{
                position: absolute;
                right: .2rem;
                top: .15rem;
                display: inline-block;
                width: 30px;
                height: 25px;
            }
        }
        .content{
            position: relative;
            padding: .5rem;
            height: 11rem;
            .item{
                position: absolute;
                bottom: 0;
                display: inline-block;
                width: 2.72rem;
	            height: 2.37rem;
                text-align: center;
                i{
                    width: 1.72rem;
	                height: 1.9rem;
                    display: inline-block;
                }
                .class2-0{
                    @include background($money2-0);
                }
                .class2-1{
                    @include background($money2-1);
                }
                .class2-2{
                    @include background($money2-2);
                }
                .class5-0{
                    @include background($money5-0);
                }
                .class5-1{
                    @include background($money5-1);
                }
                .class5-2{
                    @include background($money5-2);
                }
                .class10-0{
                    @include background($money10-0);
                }
                .class10-1{
                    @include background($money10-1);
                }
                .class10-2{
                    @include background($money10-2);
                }
                .class15-0{
                    @include background($money15-0);
                }
                .class15-1{
                    @include background($money15-1);
                }
                .class15-2{
                    @include background($money15-2);
                }
                .class20-0{
                    @include background($money20-0);
                }
                .class20-1{
                    @include background($money20-1);
                }
                .class20-2{
                    @include background($money20-2);
                }
                .class25-0{
                    @include background($money25-0);
                }
                .class25-1{
                    @include background($money25-1);
                }
                .class25-2{
                    @include background($money25-2);
                }
                .class30-0{
                    @include background($money30-0);
                }
                .class30-1{
                    @include background($money30-1);
                }
                .class30-2{
                    @include background($money30-2);
                }
                
                .text{
                    color: #4d4d4d;
                    font-size: 0.3rem;
                    text-align: center;
                }
            }
            .item0{
                top: 2.4rem;
                left: .3rem;
            }
            .item1{
                top: .8rem;
                left: 3.35rem;
            }
            .item2{
                top: 3.8rem;
                left: 3rem;
            }
            .item3{
                top: 4.6rem;
                left: 6.2rem;
            }
            .item4{
                top: 7.8rem;
                left: 5.5rem;
            }
            .item5{
                bottom: .8rem;
                left: 2.5rem;
            }
            .item6{
                bottom: 3.4rem;
                left: .3rem;
            }
        }
    }
    .loginreg-wrapper{
        position: fixed;
        width: 100%;
        top: 0;
        bottom: 0;
        background-color: #ffffff;
        z-index: 999999999999999;
        overflow: hidden;
    }
    .guanggao-wrapp{
        position: fixed;
        left: 0;
        bottom: 0;
        padding: 10px;
        width: 100%;
        height: 1.65rem;
        background-color: #ffffff;
        box-sizing: border-box;
        box-shadow: 0 -0.1rem 0.1rem rgba(0,0,0,0.1);
        img{
            position: relative;
            bottom: 1rem;
            width: 1.5rem;
            height: 2rem;
            border-radius: 3px;
            box-shadow: 0 0 0.15rem rgba(0,0,0,0.5);
        }
        span{
            position: absolute;
            left: 2.2rem;
            top: 50%;
            transform: translateY(-50%);
            display: inline-block;
        }
        .download-text{
            font-size: .4rem;
            color: #333;
        }
        .download-num{
            font-size: .3rem;
            color: #888;
        }
        button{
            position: absolute;
            top: 50%;
            right: 10px;
            transform: translateY(-50%);
            padding: .15rem .2rem;
            background-color: #ff9744;
            color: #ffffff;
            border-radius: .1111rem;
        }
    }
}